<template>
  <div class="report_box">
    <n-grid y-gap="15" x-gap="15" :cols="val.cols">
      <template v-for="item in val.reportdata">
        <n-gi>
          <div class="report _box _box_row _pd045">
            <div class="_box1">
              <template v-if="cfg?.guild?.season <= 2000">
                {{ item.round }} Lv.{{ item.level }} /
              </template>
              {{ item.user_name }} /
              <n-time unix :time="item.log_time" format="MM-dd hh:mm" />
            </div>
            <div class="_box2">
              <div class="_left">
                <div class="_boss_box">
                  <img
                    :class="`_boss_set_${item.boss_name}`"
                    :src="cfg.function.boss_ava(item.boss_name, 60)"
                  />
                </div>
              </div>
              <div class="_right">
                <div class="_damage">
                  {{ item.damage.toLocaleString() ?? 0
                  }}<span style="font-size: 0.8rem; padding-left: 0.5rem">伤害</span>
                </div>
                <div class="_imglist">
                  <template v-for="item in item?.icon?.split(',')">
                    <img class="_avatar" :src="cfg.function.ava(item)" />
                  </template>
                </div>
              </div>
            </div>

            <div class="_mobile_right" v-if="cfg.mobile == true">
              <div class="_imglist">
                <template v-for="item in item?.icon?.split(',')">
                  <img class="_avatar" :src="cfg.function.ava(item)" />
                </template>
              </div>
            </div>
          </div>
        </n-gi>
      </template>
    </n-grid>
  </div>
  <br />
</template>

<script>
import { cfg } from "@/cfg/cfg.js";

export default {
  props: {
    val: {},
  },
  setup(props) {
    return {
      cfg,
      val: props.val,
    };
  },
};
</script>
